<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:p="http://primefaces.org/ui"
	xmlns:pretty="http://ocpsoft.com/prettyfaces"
	xmlns:ui="http://java.sun.com/jsf/facelets">

<ui:composition template="../templates/mainTemplate.xhtml">
	<ui:define name="content">
		<div class="box">
			<h2>
				<a id="toggle-single-price" href="#"><h:outputFormat
						value="#{msg['indexcompanylist.indexManagement']}" /></a>
			</h2>
			<div id="single-price" class="block tables">

				<h:form>
					<p:messages showDetail="true" showSummary="false" autoUpdate="true" />

					<div id="top_left" style="width: 48%; float: left;">
						<table>
							<thead>
								<tr>
									<th colspan="2" class="table-head"><h:outputText
											value="#{msg['indexcompanylist.indexManagement']}" /></th>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td><p:inputText id="index"
											value="#{indexCompanyListBean.name}" required="false" 
											title="#{msg['indexCompanyList.ToolTip.newIndex']}"/>
											<p:tooltip for="index" showEvent="focus" showEffect="fade" hideEffect="fade" /></td>
									<td><p:commandButton id="addButton"
											action="#{indexCompanyListBean.add}" update="@form"
											value="#{msg['indexcompanylist.add']}" /></td>
								</tr>
							</tbody>
						</table>
					</div>


					<div id="top_right" style="width: 48%; float: right;">
						<table>
							<thead>
								<tr>
									<th colspan="2" class="table-head"><h:outputText
											value="#{msg['indexcompanylist.selectIndex']}" /></th>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td><p:selectOneMenu id="indexComboBox" 
											value="#{indexCompanyListBean.selectedIndex}">
											<f:selectItems value="#{indexCompanyListBean.indicesList}"
												var="index" itemLabel="#{index.name}"
												itemValue="#{index.name}" />
											<p:ajax listener="#{indexCompanyListBean.select}"
												process="@none" update="@form" />
										</p:selectOneMenu>
										<p:tooltip for="indexComboBox" value="#{msg['indexCompanyList.ToolTip.indexList']}" showEffect="fade" hideEffect="fade" /></td>
									<td><p:commandButton id="deleteButton"
											action="#{indexCompanyListBean.remove}" update="@form"
											value="#{msg['indexcompanylist.deleteIndex']}" /></td>
								</tr>
							</tbody>
						</table>
					</div>


					<div class="clear" />


					<div id="centerDiv"
						style="width: 80%; text-align: center; margin-left: auto; margin-right: auto;">
						<p:pickList id="pickList"
							value="#{indexCompanyListBean.companies}" var="company"
							iconOnly="true" itemLabel="#{company}" itemValue="#{company}">
							<f:facet name="sourceCaption">
								<h:outputFormat value="#{msg['indexcompanylist.allCompanies']}" />
							</f:facet>
							<f:facet name="targetCaption">
								<h:outputFormat
									value="#{msg['indexcompanylist.selectedIndexCompanies']}" />
							</f:facet>
						</p:pickList>

						<p:commandButton id="saveButton" style="width: 100%;"
							action="#{indexCompanyListBean.save}"
							binding="#{indexCompanyListBean.button}" update="@form"
							value="#{msg['indexcompanylist.saveChanges']}" />
					</div>
				</h:form>
			</div>
		</div>
	</ui:define>
</ui:composition>

</html>
